<div class="bg-light lter b-b wrapper-md">
  <h1 class="m-n font-thin h3">菜单管理</h1>
</div>
<div class="wrapper-md">


  <div class="panel panel-default">
    <div class="panel-heading">
      菜单管理
    </div>
<div >






  <div  ng-controller="dataTablesCtrl">
   <div class="row">

 <div class="col-sm-12" >
 <div class="panel-heading">

<a ui-sref="app.menuInfo.menuInfoEdit"><button class="btn btn-default btn-sm "><i class="fa fa-plus fa-lg"></i>&nbsp; 新增</button></a>

<a href="javascript:void(0);" ng-click="goEdit();" ><button class="btn btn-default btn-sm "><i class="fa fa-edit fa-lg"></i>&nbsp; 编辑</button></a>

<a href="javascript:void(0);" ng-click="goRemove();" ><button class="btn btn-default btn-sm "><i class="fa fa-trash-o fa-lg"></i>&nbsp; 删除</button></a>

<!--隐藏域-->
<input type="hidden" id ="optIds" name="optIds">


</div>
 </div>


 </div>
      <table id="myTable" class="table table-striped m-b-none">
      </table>


    
    </div>



  </div>

</div>




<script type="text/javascript" >


function checkOne(){
  var optIds = '';
  $("input[name='ids']:checkbox:checked").each(function(){ 
      optIds+=$(this).val() +',';
       });
   if(''!=optIds){
        optIds = optIds.substring(0,optIds.length-1);
      }
$('#optIds').val(optIds);

  console.log($('#optIds').val());
}


//angularjs总控制器
app.controller('dataTablesCtrl', function($scope, $http,$state) {
//进入编辑页面
   $scope.goEdit = function () {
  var optIds = $('#optIds').val();
     if(''==optIds){
    top.layer.msg('请至少选择一项', {icon: 6});
       return false;
  }
  if(optIds.indexOf(",") != -1){
    top.layer.msg('编辑只能选择一项', {icon: 6});
    return false;
  }
        $state.go('app.menuInfo.menuInfoEdit', {infoId: optIds});
    };



//进入编辑页面
   $scope.goRemove = function () {
  var optIds = $('#optIds').val();
     if(''==optIds){
    top.layer.msg('请至少选择一项', {icon: 6});
       return false;
    }

    top.layer.confirm('您确定删除这些信息吗', function(index){
    $.ajax({
      url : 'stream/updateDisplay.do',
      type : 'post',
      data : {
        ids:optIds
      },
      cache : false,
      success : function(data) {
        top.layer.msg('操作成功', {icon: 6});
      }
    });
    top.layer.close(index);
  });
    };
});






   var dtUrl = API_URL+"menu_info?query=delflag:0";

    $(document).ready(function(){

    $('#myTable').dataTable({      
        "ajax": {
                "url": dtUrl,
                "dataSrc": ""
            },
        "columns": [
          { data : "Id",
                    title: "<input type='checkbox' id='allChecked' name='allChecked' />",
                  orderable: false , 
              render : function(data, type, full, meta) {
            return '<input type="checkbox" value="'+ data + '" name="ids" onclick="checkOne()"/>';
           }},
            { "data": "Id","width":"auto","title":"ID" },
            { "data": "MenuName" ,"width":"auto","title": "菜单名称"},
         
            { "data": "MenuUrl" ,"width":"auto","title": "菜单地址"},
               { "data": "MenuDisplayOrder" ,"width":"auto","title": "显示顺序"},
             { data: "UpdateTime"   ,

         title: "更新时间",
                    render: function (data, type, row, meta) {

                        return getDateTime(data);
                    }}
        ],
        initComplete:function(data){



//全选、反选
$('#allChecked').on('click' , function(){
  var boxes = document.getElementsByName("ids");
    for(i=0;i<boxes.length;i++){
                boxes[i].checked = this.checked;
    }
    var optIds ='';
    if(this.checked){
      $("input[name='ids']:checkbox:checked").each(function(){ 
      optIds+=$(this).val() +',';
       });
    }else{
  optIds='';
      }
      if(''!=optIds){
        optIds = optIds.substring(0,optIds.length-1);
      }
      $('#optIds').val(optIds);
});
           },
       
         //当处理大数据时，延迟渲染数据，有效提高Datatables处理能力
        deferRender: true,
        processing: true,
        language: {
           url: 'vendor/jquery/datatables/Chinese.json'
    },
    responsive: true,
    searching: true,
    ordering: true,
    lengthChange: true 

});
});  

</script>